{% extends 'userbase.html' %}
{% load staticfiles %}
{% block title %}常用联系人{% endblock %}
{% block right %}
   <div class="w700 fr">
		<div class="public_box">
			<!-----------------常用联系人---------------->
			<div id="set_box">
            <form method="post" action="{% url 'setting' 'contact' %}">
				<div class="title"><h2>常用联系人</h2></div>
				<table class="table_list">
					<tr>
						<th>姓名：</th>
						<td><input class="text" type="text" name="name" value=""/></td>
					</tr>
					<tr>
						<th>所在地区：</th>
                        <td>
                            <select id="pro" class="am-radio" style="padding: 0">
                                        <option value="">省</option>
                            </select>
                            <select id="city" class="am-radio" style="padding: 0">
                                        <option value="">市</option>
                            </select>
                            <select id="county" class="am-radio" style="padding: 0" name="city_addr">
                                        <option value="">区/县</option>
                            </select>
                            <div id="city_addr"></div>
                        </td>
					</tr>
					<tr>
						<th>详细地址：</th>
						<td><textarea name="address"></textarea></td>
					</tr>
					<tr>
						<th>手机号码：</th>
						<td><input class="text" type="text" name="mobile" /></td>
					</tr>
					<tr>
						<th>邮政编码：</th>
						<td><input class="text" type="text" name="zip_code" /></td>
					</tr>
					<tr>
						<td colspan="2">
							<label class="am-checkbox">
								<input name="is_default" type="checkbox" id="checkbox_a1" class="chk_1"  />
								<label for="checkbox_a1"></label> 设置为默认
							</label>
						</td>
					</tr>
				</table>
                {% csrf_token %}
				<div class="operation"><input type="submit" class="save" value="保存" /></div>
            </form>
				<!-----------------联系列表---------------->
				<ul class="address">
					<li class="title">已保存{{ alreadycount }}条地址，还能保存{{ remainingcount }}条</li>
                    {% for contact in all_contacts %}
					<li>
						<div>
							<div class="dt">联系人：</div>
							<div class="dd">{{ contact.name }}</div>
							<div class="clear"></div>
						</div>
						<div>
							<div class="dt">详细地址：</div>
							<div class="dd">
								<p>{{ contact.city }}</p>
								<p>{{ contact.address }}</p>
							</div>
							<div class="clear"></div>
						</div>
						<div>
							<div class="dt">邮政编码：</div>
							<div class="dd">{{ contact.zip_code }}</div>
							<div class="clear"></div>
						</div>
						<div>
							<div class="dt">手机号码：</div>
							<div class="dd">{{ contact.mobile }}</div>
							<div class="clear"></div>
						</div>
						<a class="i-first" id="setdefault" href="{% url 'default_contact' contact.id %}">
                            {% if contact.is_default == True %}
						        默认地址
                            {% else %}
                                设为默认地址
						    {% endif %}
                        </a>
							<div class="btns">
							<a href="{% url 'modify_contact' contact.id %}" data-id="183590" class="modifyThis">修改</a> / <a href="{% url 'delete_contact' contact.id %}" data-id="183590" class="delThis">删除</a>
						</div>
                    {% endfor %}
                </ul>

			</div>

		</div>
	</div>
{% endblock %}

{% block script %}
    <script>
        $(function () {
            //获取所有省份
            $.get('{% url "province" %}', function (dic) {
                pro = $('#pro')
                $.each(dic.prov, function (index, item) {
                    pro.append('<option value=' + item[0] + '>' + item[1] + '</option>');
                });
            });
            //获取市信息
            $('#pro').change(function () {
                $.get('/city_' + $(this).val() + '/', function (dict) {
                    city = $('#city');
                    city.empty().append('<option value="">市</option>');
                    $('#county').empty().append('<option value="">区/县</option>');
                    $.each(dict.city, function (index, item) {
                        city.append('<option value=' + item[0] + '>' + item[1] + '</option>');
                    })
                });
             });

            //获取区县信息
            $('#city').change(function () {
                $.get('/county_' + $(this).val() + '/', function (dict) {
                    county = $('#county');
                    county.empty().append('<option value="">区/县</option>');
                    $.each(dict.coun, function (index, item) {
                        county.append('<option value=' + item[0]+ '>' + item[1] + '</option>');
                    })
                })
            });
        })
    </script>
{% endblock %}